<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta charset="utf-8">
	<title>批改作业页面</title>
	<script type="text/javascript">
		var subject = []; //存储从服务器请求得到的试题
		var subjectID = [];
		var pointer = 0; //做题时题号指针
		var anser = []; //存储从服务器请求得到的试题回答;
		var mark = []; //记录每题得分
		var time = []; //记录每道题解题时间
		var grade = []; //记录每道题的等级
		
		function jz(){
			return false;
			}
			document.oncontextmenu=jz;
		
		function callback(){
			var data = document.getElementById("subjected").value.split("\u0001");
			for(var i=0;i<data.length;i++){
				var wap = data[i].split("\u0002");
				subjectID[i] = wap[0];
				subject[i] = wap[1];
				anser[i] = wap[2];
				time[i] = wap[3];
				mark[i] = wap[4];
				grade[i] = wap[5];
			}
			
			document.getElementById("l1").value = subject[pointer];
			document.getElementById("l2").value = anser[pointer];
			var m = document.getElementById("s");
			if(mark[pointer]=="-1") m.value = "";
			else m.value = mark[pointer];
			document.getElementById("writeTime").innerHTML = getTime(time[pointer]);
			if(time[pointer]<12) document.getElementById("writeGrade").innerHTML = "疑似抄袭";
			else document.getElementById("writeGrade").innerHTML = "正常";
			
		}

		function sub(){
			mark[pointer] = document.getElementById("s").value;
			grade[pointer] = getRadio();
			if(mark.length<subject.length-1){
				alert("尚有题未评分！")
				return;
			}
			var flag = confirm("批改完成，确认提交？");
			if(!flag) return;
			createJ();
			var partData = "";
			for(var i=0;i<subject.length-1;i++){
				partData = partData+subjectID[i]+"\u0002"+time[i]+"\u0002";
				partData = partData +mark[i]+"\u0002"+grade[i]+"\u0001";
			}
			var url = "subPractiseCorrecting.view?partData="+partData;
			request(url,stop);
		}
		function stop(x){
			var res = x.responseText;
			stopJ();
			if(res=="true"){
				alert("提交成功！");
				window.location.href = "showPractiseStuList.view";
			}
			else alert("提交失败！！！");
		}

		function runing(){
			var str=document.getElementById("l2").value;
			anser[pointer] = str;
			var url = "correcting.view?runback=runback&sql="+str;
			request(url,runBack);
		}

		function runBack(xmlhttp){ 
			var r = document.getElementById("result");
			var res = xmlhttp.responseText;
			r.value = res.replace(/\u0005|\u0006/g,"");
		}

		function createXMLHttpRequest() { //创建XMLHttpRequest 异步请求对象
			var XMLHttp = 
			[
				function () {return new XMLHttpRequest();},
				function () {return new ActiveXObject("Msxml2.XMLHTTP");},
				function () {return new ActiveXObject("Msxml3.XMLHTTP");},
				function () {return new ActiveXObject("Microsoft.XMLHTTP");}
			];

			var xmlhttp = false;

			for(var i=0;i<XMLHttp.length;i++){
				try{
					xmlhttp = XMLHttp[i]();
				}
				catch(e){
					continue;
				}
				break;
				
			}
			return xmlhttp;
		}


		function request(url,callback,data){ //进行异步请求
			var xmlhttp = createXMLHttpRequest();
			if(!xmlhttp) return false;
			var method = (data) ? "POST" : "GET";
			xmlhttp.open(method,url,true);
			xmlhttp.setRequestHeader('User-Agent','XMLHTTP/1.0');
			xmlhttp.setRequestHeader('Content-type','application/x-www-from-urlencoded');
			xmlhttp.onreadystatechange = function(){ //重写xmlhttp对象的onreadystatechange方法，该方法系浏览器自动执行，故写在请求动作之前无碍
								//该方法表示请求完成后对请求状态的判断，当且仅当请求是成功的才执行回调函数
				if(xmlhttp.readyState != 4) return false;
				if(xmlhttp.status != 200 && xmlhttp.status != 304){
					alert("HTTP 请求错误!"+xmlhttp.status);
					window.location.href = "error.html";
					return false;
				}
				callback(xmlhttp); //执行回调函数;
			}
			//if(xmlhttp.readyState == 4) return true;
			xmlhttp.send(data); //向服务器发送异步请求
		}
		
		function createJ(){
			document.getElementById("cover").style.display = "block";
			document.getElementById("jbar").style.display = "block";
		}
		function stopJ(){
			document.getElementById("cover").style.display = "none";
			document.getElementById("jbar").style.display = "none";
		}

		function p(){ //点击上一题的动作
			 var s = document.getElementById("s"); //保存本题得分
		    if(s.value==""){
				alert("请为本题评分！");
				return;
			}
		    mark[pointer] = s.value;
		    grade[pointer] = getRadio();
		    
		    if(mark[--pointer]!="-1") s.value = mark[pointer]; 
		    else s.value = "";
		    document.getElementById("writeTime").innerHTML = getTime(time[pointer]);
			if(time[pointer]<12) document.getElementById("writeGrade").innerHTML = "疑似抄袭";
			else document.getElementById("writeGrade").innerHTML = "正常";

			if(pointer==0) document.getElementById("previous").disabled = true;
			document.getElementById("next").disabled = false;
			var b = document.getElementById("l1").value = subject[pointer];
			if(typeof(anser[pointer])!="undefined")
			document.getElementById("l2").value = anser[pointer];
			
		}
		function n(){ //点击下一题的动作
			var s = document.getElementById("s"); //保存本题得分
			if(s.value==""){
				alert("请为本题评分！");
				return;
			}
			 mark[pointer] = s.value;
			 grade[pointer] = getRadio();

			if(mark[++pointer]!="-1") s.value = mark[pointer];
			else s.value = "";
			document.getElementById("writeTime").innerHTML = getTime(time[pointer]);
			if(time[pointer]<12) document.getElementById("writeGrade").innerHTML = "疑似抄袭";
			else document.getElementById("writeGrade").innerHTML = "正常";
			
		   
			if(pointer==subject.length-2) document.getElementById("next").disabled = true;
			document.getElementById("previous").disabled = false;
			document.getElementById("l1").value = subject[pointer];
			if(typeof(anser[pointer])!="undefined")
			document.getElementById("l2").value = anser[pointer];

		}
		document.onkeydown=function(event){
		    var e = event || window.event || arguments.callee.caller.arguments[0];
		    if(e && e.keyCode==113)   runing(); //F2   
		}
		function getRadio(){
			var radio = document.getElementsByName("choose");
			var index = 0;
			for(var i=0;i<radio.length;i++)
				if(radio[i].checked){
					index = i;
					radio[i].checked = false;
				}
			return index;
		}
		function getTime(time){
			if(time=="0") return "一瞬间！！";
			var t = parseInt(time);
			var h,m,s,res="";
			var swap =parseInt(t/60);
			h = parseInt(swap/60);
			m = parseInt(t/60)%60;
			s = t%60;
			if(h!=0) res = res+h+" 小时 ";
			if(m!=0) res = res+m+" 分钟 ";
			if(s!=0) res = res+s+" 秒";
			return res;
		}
	</script>
	<style type="text/css">
		html{
			height: 96%;
			width:100%;
		}
		body{
			height: 100%;
			width:99%;
			background:#cacaca;
			background-image: url("img/qq.jpg");
			color: #cc3399;
		}
		@media only screen and (max-width: 1920px), only screen and (max-device-width:1920px) {
	 		html,body {
	 			font-size:19px;
	 		}
	 		.btn{
	 			width:95px;
	 		}
 		}
		@media only screen and (max-width: 1366px), only screen and (max-device-width:1366px) {
	 		html,body {
	 			font-size:17px;
	 		}
	 		.btn{
	 			width:80px;
	 		}
 		}
 		@media only screen and (max-width: 1080px), only screen and (max-device-width:1080px) {
	 		html,body {
	 			font-size:14px;
	 		}
	 		.btn{
	 			width:73px;
	 		}
 		}
 		@media only screen and (max-width: 960px), only screen and (max-device-width:960px) {
	 		html,body {
	 			font-size:10px;
	 		}
 		}
 		@media only screen and (max-width: 800px), only screen and (max-device-width:800px) {
	 		html,body {
	 			font-size:9px;
	 		}
 		}
		#con{
			width: 100%;
			height: 100%;
		}
		#left{
			float: left;
			width: 45%;
			height:99%;
		}
		#right{
			float: right;
			width: 55%;
			height:99%;
		}
		#l1{
			width: 100%;
			height:30%;
		}
		#l2{
			width: 100%;
			height: 55%;
		}
		#result{
			width: 98%;
			height: 100%;
		}
		.text{
			font-size: 20px;
			color: BLUE;
			background-color: #d4d1bb;
		}
		#bar{
			width: 100%;
			height: 35px;
			border-width: 1px;
			border-style: dashed;
		}
		#bar2{
			width: 100%;
			height: 50px;
			border-width: 1px;
			border-style: dashed;
		}
		
		#cover{
			position: absolute;
			left: 0px;
			top: 0px;
			width: 100%;
	        height: 100%;
			background-color: #777;
	        z-index: 2;
	        display: none;
	        filter:alpha(Opacity=60);
	        -moz-opacity:0.6;
	        opacity: 0.6; 
	        border-style: solid;
			border-width: 1px;
	}
	#jbar{
			width:24%;
			position: absolute;
			z-index: 3;
        	background-color: #00A1FC;
			top: 25%;
			left:38%;
			display:none;
		}
		#jbar img{
			width:100%;
		}
	</style>

</head>
<body onload="callback()">
	
	<div id="cover"></div>
	<div id="jbar"> 
		<img src="img/sub.gif">
	</div>
	
	
	<div id="con">
		<textarea rows="" cols="" id="subjected" style="display:none"><%=request.getAttribute("partData") %></textarea>
		<div id="left">
			<textarea class="text" id="l1" readonly="true"></textarea>
			<div id="bar2">
				<label>解答本题用时：</label> <label id="writeTime"> </label>
				&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
				&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
				<label>评定：</label> <label id="writeGrade"></label>
				</br>
				<form action="" id="ch">
				<label>本题星级:</label> 
					不给<input type="radio" name="choose">
					一颗<input type="radio" name="choose">
					二颗<input type="radio" name="choose">
					三颗<input type="radio" name="choose">
					四颗<input type="radio" name="choose">
					五颗<input type="radio" name="choose">
				</form>
			</div>
			
			<div id="bar">
				<form action="">
					<label>工具栏:</label>
					<input class="btn" type="button" name="finlish" id="finlish" value="提交批阅" onclick="sub()">
					<input class="btn" type="button" name="previous" id="previous" value="上一题" onclick="p()" disabled="true">
					<input class="btn" type="button" name="next" id="next" value="下一题" onclick="n()">
					<input class="btn" type="button" name="run" id="run" value="执行(F2)" onclick="runing()">
					<label style="color:RED">&nbsp本题得分</label>
					<input type="text" name="score" style="width:25px;margin-left:0px;" id="s">
				</form>	
			</div>
			<textarea class="text" id="l2"  readonly="true"></textarea>
		</div>

		<div id="right">
			<textarea class="text" id="result" readonly="true"></textarea>
		</div>
	</div>

</body>
</html>
